import React, { PureComponent } from 'react';
import { NavBar, Icon } from 'antd-mobile';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import xiaoxi from '../../assets/svg/xiaoxi.svg';

class CartTitle extends PureComponent {
  constructor(props) {
    super(props);
  }

    componentWillUnmount(){
        const { editStatus } = this.props.cart;
        if(editStatus==false){
            this.props.dispatch({ type: 'cart/changeEditStatus' });
        }
    }
  render() {
    const { editStatus } = this.props.cart;

    return (
      <NavBar
        style={{ width:"100%",height:"1rem", backgroundColor:"#fff", color:'#000' }}
        mode="dark"
        icon={<Icon key="1" type="left" style={{width:'.55rem',height:'.55rem'}} />}
        onLeftClick={() => {
          this.props.dispatch(routerRedux.goBack());
        }}
        rightContent={[
          <div
            onClick={() => {
            this.props.dispatch({ type: 'cart/changeEditStatus' });
          }}
            style={{ padding: '0.15rem 0.2rem', color:"#999" }}
            key="1"
          >{this.props.cartIds==""?"": editStatus == true ? '编辑' : '完成' }
          </div>,
            <Icon key="2" type={xiaoxi.id} onClick={ e => this.props.dispatch(routerRedux.push({pathname: "/messagesCenter"})) }/>
        ]}
      >
        购物车
      </NavBar>
    );
  }
}

export default connect(({ cart }) => ({ cart }))(CartTitle);
